@import "tailwindcss";

:root {
  --background: 0 0% 100%;
  --foreground: 222.2 84% 4.9%;
  --card: 0 0% 100%;
  --card-foreground: 222.2 84% 4.9%;
  --popover: 0 0% 100%;
  --popover-foreground: 222.2 84% 4.9%;
  --primary: 221.2 83.2% 53.3%;
  --primary-foreground: 210 40% 98%;
  --secondary: 210 40% 96%;
  --secondary-foreground: 222.2 84% 4.9%;
  --muted: 210 40% 96%;
  --muted-foreground: 215.4 16.3% 46.9%;
  --accent: 210 40% 96%;
  --accent-foreground: 222.2 84% 4.9%;
  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 210 40% 98%;
  --border: 214.3 31.8% 91.4%;
  --input: 214.3 31.8% 91.4%;
  --ring: 221.2 83.2% 53.3%;
  --radius: 0.5rem;
}

@media (prefers-color-scheme: dark) {
  :root {
    --background: 222.2 84% 4.9%;
    --foreground: 210 40% 98%;
    --card: 222.2 84% 4.9%;
    --card-foreground: 210 40% 98%;
    --popover: 222.2 84% 4.9%;
    --popover-foreground: 210 40% 98%;
    --primary: 217.2 91.2% 59.8%;
    --primary-foreground: 222.2 84% 4.9%;
    --secondary: 217.2 32.6% 17.5%;
    --secondary-foreground: 210 40% 98%;
    --muted: 217.2 32.6% 17.5%;
    --muted-foreground: 215 20.2% 65.1%;
    --accent: 217.2 32.6% 17.5%;
    --accent-foreground: 210 40% 98%;
    --destructive: 0 62.8% 30.6%;
    --destructive-foreground: 210 40% 98%;
    --border: 217.2 32.6% 17.5%;
    --input: 217.2 32.6% 17.5%;
    --ring: 224.3 76.3% 94.1%;
  }
}

* {
  border-color: hsl(var(--border));
}

body {
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* 扁平化设计 - 移除所有阴影 */
.no-shadow * {
  box-shadow: none !important;
}

/* 紧凑布局样式 */
.compact {
  padding: 0.5rem;
  margin: 0.25rem;
}

/* 蓝色主题强调 */
.theme-blue {
  --primary: 221.2 83.2% 53.3%;
  --primary-foreground: 210 40% 98%;
}

/* Markdown样式覆盖 */
.prose {
  color: inherit;
  max-width: none;
}

.prose h1, .prose h2, .prose h3, .prose h4, .prose h5, .prose h6 {
  margin-top: 0.5em;
  margin-bottom: 0.25em;
  font-weight: 600;
}

.prose p {
  margin-top: 0.25em;
  margin-bottom: 0.25em;
}

.prose ul, .prose ol {
  margin-top: 0.25em;
  margin-bottom: 0.25em;
  padding-left: 1.5em;
}

/* 嵌套列表样式 - 一级用实心圆点 */
.prose ul {
  list-style-type: disc;
}

/* 二级嵌套列表用空心圆点 */
.prose ul ul {
  list-style-type: circle;
}

/* 三级嵌套列表用方块 */
.prose ul ul ul {
  list-style-type: square;
}

/* 四级及以下继续使用方块 */
.prose ul ul ul ul {
  list-style-type: square;
}

.prose ol {
  list-style-type: decimal; /* 一级有序列表使用数字 */
}

/* 二级嵌套有序列表使用小写字母 */
.prose ol ol {
  list-style-type: lower-alpha;
}

/* 三级嵌套有序列表使用罗马数字 */
.prose ol ol ol {
  list-style-type: lower-roman;
}

/* 四级及以下继续使用罗马数字 */
.prose ol ol ol ol {
  list-style-type: lower-roman;
}

.prose li {
  margin-top: 0.125em;
  margin-bottom: 0.125em;
  display: list-item; /* 确保列表项正确显示 */
}

.prose code {
  background-color: rgba(0, 0, 0, 0.1);
  padding: 0.125em 0.25em;
  border-radius: 0.25em;
  font-size: 0.875em;
}

.prose pre {
  background-color: rgba(0, 0, 0, 0.05);
  padding: 0.75em;
  border-radius: 0.5em;
  margin: 0.5em 0;
  overflow-x: auto;
}

.prose blockquote {
  border-left: 3px solid rgba(0, 0, 0, 0.2);
  padding-left: 1em;
  margin: 0.5em 0;
  font-style: italic;
}

.prose table {
  margin: 0.5em 0;
  border-collapse: collapse;
  width: 100%;
}

.prose th, .prose td {
  border: 1px solid rgba(0, 0, 0, 0.2);
  padding: 0.375em 0.75em;
}

.prose th {
  background-color: rgba(0, 0, 0, 0.05);
  font-weight: 600;
}

/* 暗色模式适配 */
@media (prefers-color-scheme: dark) {
  /* 嵌套列表样式 - 一级用实心圆点 */
  .prose ul {
    list-style-type: disc;
  }

  /* 二级嵌套列表用空心圆点 */
  .prose ul ul {
    list-style-type: circle;
  }

  /* 三级嵌套列表用方块 */
  .prose ul ul ul {
    list-style-type: square;
  }

  /* 四级及以下继续使用方块 */
  .prose ul ul ul ul {
    list-style-type: square;
  }

  .prose ol {
    list-style-type: decimal; /* 一级有序列表使用数字 */
  }

  /* 二级嵌套有序列表使用小写字母 */
  .prose ol ol {
    list-style-type: lower-alpha;
  }

  /* 三级嵌套有序列表使用罗马数字 */
  .prose ol ol ol {
    list-style-type: lower-roman;
  }

  /* 四级及以下继续使用罗马数字 */
  .prose ol ol ol ol {
    list-style-type: lower-roman;
  }

  .prose code {
    background-color: rgba(255, 255, 255, 0.1);
  }

  .prose pre {
    background-color: rgba(255, 255, 255, 0.05);
  }

  .prose blockquote {
    border-left-color: rgba(255, 255, 255, 0.3);
  }

  .prose th, .prose td {
    border-color: rgba(255, 255, 255, 0.2);
  }

  .prose th {
    background-color: rgba(255, 255, 255, 0.05);
  }
}

/* 滚动条样式 */
.scrollbar-thin {
  scrollbar-width: thin;
}

.scrollbar-thin::-webkit-scrollbar {
  width: 6px;
}

.scrollbar-thin::-webkit-scrollbar-track {
  background: transparent;
}

.scrollbar-thin::-webkit-scrollbar-thumb {
  background-color: rgba(156, 163, 175, 0.5);
  border-radius: 3px;
}

.scrollbar-thin::-webkit-scrollbar-thumb:hover {
  background-color: rgba(156, 163, 175, 0.7);
}
